import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.VirtualKeyboard 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import QtGraphicalEffects 1.15

import MyApp 1.0
import Device 1.0

import "Chart/"
import "Components" as Components

Window {
    id: theWindow
    width: 1920
    height: 1080
    visible: true
    title: qsTr("Hello World")

    function randomScalingFactor() {
        return Math.random().toFixed(1)
    }

    Components.Result {
        id: result_chart
        z: 20
        anchors.centerIn: parent
    }

    Rectangle {
        property int cur_id: 255
        anchors.fill: parent
        color: "white"

        ColumnLayout {
            anchors.fill: parent
            spacing: 0

            Components.Header {
                Layout.fillWidth: true
                height: 120
                z: 2
                setCurId: function (id) {
                    device_list.cur_id = id
                }
            }

            RowLayout {
                Layout.fillHeight: true
                Layout.fillWidth: true

                Rectangle {
                    Layout.fillHeight: true
                    width: 600
                    color: "lightgrey"
                    Components.DeviceList {
                        id: device_list
                        anchors.fill: parent
                    }
                }
                Rectangle {
                    // mainView
                    Layout.fillHeight: true
                    Layout.fillWidth: true
                    color: "white"

                    StackLayout {
                        id: main_view
                        anchors.fill: parent
                        currentIndex: device_list.cur_id == 255 ? 0 : 1
                        anchors.margins: 25

                        Components.General {
                            Layout.fillWidth: true
                            Layout.fillHeight: true
                        }

                        Components.Device {
                            result_chart: result_chart
                            Layout.fillWidth: true
                            Layout.fillHeight: true
                        }
                    }

                    // Button {
                    //     height:100
                    //     width:200
                    //     onClicked: function() {
                    //         server.newMeasure(1);
                    //     }
                    // }
                }
            }
        }
    }

    InputPanel {
        id: inputPanel
        z: 99
        x: 0
        y: theWindow.height
        width: theWindow.width

        states: State {
            name: "visible"
            when: inputPanel.active
            PropertyChanges {
                target: inputPanel
                y: window.height - inputPanel.height
            }
        }
        transitions: Transition {
            from: ""
            to: "visible"
            reversible: true
            ParallelAnimation {
                NumberAnimation {
                    properties: "y"
                    duration: 250
                    easing.type: Easing.InOutQuad
                }
            }
        }
    }
}
